<div class="animation_wrapper">
  <script type="data/animation" class="animation_source">
    {{"position":{position}, 
      "animation":{animation}, 
    "max_position":{max_position}
    }}
  </script>
  <div class="animation_header"> 
    <div class="animation_flex_column animation_left">
      <div style="flex-grow:1;"> </div>
      <span class="ui-icon ui-icon-triangle-1-w" style="vertical-align:middle; height:16;"></span>
      <div style="flex-grow:1">
      </div>
    </div>
    <div class="animation_slider_wrapper" style="flex-grow:1">
      <div class="animation_slider" ></div>
    </div>
    <div class="animation_flex_column animation_right">
      <div style="flex-grow:1"> </div>
      <span class="ui-icon ui-icon-triangle-1-e" style="vertical-align:middle; height:16;"></span>
      <div style="flex-grow:1">
      </div>
    </div>
  </div>
  <div style="display:flex">
    <div style="flex-grow:1"> </div>
    <div class="animation_image_wrapper">
      <img class="animation_image" src="" height={height} width={width}>
    </div>
    <div style="flex-grow:1"> </div>
  </div>
  <div class="animation_text_wrapper" style="display:flex;height:{textheight}">
    <div style="flex-grow:1"> </div>
    <div class="animation_text" style="width:{width}"></div>
    <div style="flex-grow:1"> </div>
  </div>
</div>
